<!DOCTYPE html>
<html lang="en">
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="/css/bootstrap.min.css">
    <link rel="stylesheet" href="/css/bootstrap-theme.min.css">
    <link rel="stylesheet" href="/css/plat.css">
    <script src="js/jquery-3.4.1.js"></script>
    <script src="js/plat.js"></script>
    <style>
        div{
            background-color: rgba(1,2,13,0.5);
        }
        img{
            zoom: 0.75;
        }
        .userCard{
            width: 48%;
            border: 1px solid dodgerblue;
            margin: 5px;
        }
        .info{
            overflow-y: scroll;
            height: 400px;width: 100%;
            background-color: rgba(1,2,13,0);
            color: #00FF00;
            padding: 5px;
            opacity: 0.9;
            float: right;
        }
        .changeBoss{
            height: 200px;width: 100%;
            background-color: rgba(1,2,13,0);
            padding: 5px;
            opacity: 0.9;
            float: right;
            color: #1DC116;
            font-size: 20px;
        }
        .menu{
            padding: 5px;
            font-size: 20px;
            color: cadetblue;
            background-color: rgba(1,2,13,0);
        }
        body{
            font-family: "Microsoft YaHei UI";
            background-image: url("/img/imgbg1.jpg");
            background-size: cover;
            background-repeat: no-repeat;
            font-weight: 400;
            opacity: 0.85;
        }
        .info::-webkit-scrollbar{
            display:none;/*隐藏滚动条*/
        }
        .changeBoss::-webkit-scrollbar{
            display:none;/*隐藏滚动条*/
        }
        -webkit-scrollbar{
            display:none;/*隐藏滚动条*/
        }
        .row{
            margin-right: 0px;
        }
    </style>
</head>
<body id="body">
<!--    <div>-->
    <div class="row" >
    <input id="username" type="hidden" th:value="${username}">
<!--    <h4>-->
<!--        <span th:text="'Hello,' + ${username}"></span>-->
<!--        当前房间状态: <span id="roomStatus" style="color: #00a8c6"></span><br>-->
<!--    </h4>-->
<!--    <div class="panel panel-info">-->
    <div >
<!--        <div class="panel-heading">-->
        <h4 style="color: navajowhite">
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span th:text="'你好，' + ${username}"></span>
            <span style="color: #00a8c6"> 当前房间状态: </span>
            <span id="roomStatus" style="color: #00a8c6"></span><br>
        </h4>
<!--        <div id="menu" class="panel-body">&nbsp;&nbsp;-->
        <div class="menu" id="menu" >&nbsp;&nbsp;
            <a onclick="return lastbg()">上一张背景图片</a>&nbsp;&nbsp;&nbsp;
            <a onclick="return nextbg()">下一张背景图片</a>&nbsp;&nbsp;&nbsp;
            <a th:href="'/logout?username=' + ${username}">退出</a>&nbsp;&nbsp;&nbsp;
        </div>
    </div>
    <div class="col-md-8" id="player">
<!--    <div class="" id="player">-->

    </div>
    <div class="col-md-4" >
<!--    <div class="" >-->
        <div class="info" id="info">

        </div>
        <div class="changeBoss" id="changeBoss">

        </div>
    </div>
    </div>
</body>
</html>